const store = {
  state: {
    num: 20,
  },
  actions: {
    // 放同步的代码
    add1(newState: { num: number }, action: { type: string }) {
      // redux 异步写法有问题
      // setTimeout(() => {
      //   newState.num++;
      // }, 500);
      newState.num++;
    },
    add2(newState: { num: number }, action: { type: string; value: number }) {
      newState.num += action.value;
    },
    add3(newState: { num: number }, action: { type: string; value: number }) {
      newState.num += action.value;
    },
  },
  // 优化redux-thunk的异步写法 （模仿vuex）
  asyncActions: {
    asyncAdd1(dispatch: Function) {
      setTimeout(() => {
        dispatch({ type: "add1" });
      }, 1000);
    },
  },

  // 1 初始写法
  // add1: "add1",
  // add2: "add2",
  // 2 名字同一管理
  // actionNames: {
  //   add1: "add1",
  //   add2: "add2",
  // },
  // 3 优化
  actionNames: {},
};
// 我们现在想做到actionNames自动生成。不用我每一次添加一个方法，
// 都要在actionNames手动添加键值对，这样很麻烦。

let actionNames = {};
/**
 * actionNames有多少个键值对，取决于actions里有多少个函数，
 * 遍历store.actions，给actionNames添加键值对
 */
for (let key in store.actions) {
  actionNames[key] = key;
}
store.actionNames = actionNames;

export default store;
// 封装的目的：最终是有利于我们的开发或者维护
// 封装的思路是：将来开发的时候只需要把数据写和方法写入到这个
// 状态文件中，例如：XxxxStatus/index.ts，而不需要再去操作其
// 他的文件。(我们往这个方向去封装)
